{% extends 'layout-index.html' %}
{% load static %}
{% block css %}
    <link rel="stylesheet" href="{% static 'css/driving.css' %}">
{% endblock %}
{% block search %}

    <!--搜索框-->
    <div class="col-lg-6" style="width: 300px;float: right;margin-top: 10px;">
        <form method="get">
            <div class="input-group" style="display: flex">
<<<<<<< HEAD
            <label> <input style="width: 180px;height: 35px;border-radius: 10px" placeholder="通过驾校名搜索" name="q"
=======
                <label style="margin-top: 1px">
                    <input type="text" class="form-control" placeholder="通过驾校名搜索" name="q"
>>>>>>> f0eb04185cbc15f17a793618efb075babdcd937b
                           value="{{ kuang_data }}">
                </label>
                <span style="position: relative;top: 0">
                     <button type="submit" class="btn1">搜索</button>
                </span>
            </div>
        </form>
    </div>
{% endblock %}
{% block content-index %}
    <div class="container">
        <div class="row" style="margin-bottom: 20px;">
            <ul class="nav nav-pills">
                {% for item in category_list %}
                    <li><a href="\index\{{ item.id }}\">{{ item.cname }}</a></li>
                {% endfor %}
            </ul>
        </div>
        <div class="row">
            {% for goods in goods_list %}
                <a href="\goods\goodsdetails\{{ goods.id }}\" class="col-sm-6 col-md-3" style="text-decoration: none">
                    <div class="item">
                        <img style="height: 120px" src="/media/{{ goods.colorurl }}" alt="">
                        <p class="name">{{ goods.gname }}</p>
                        <p class="name">{{ goods.sname }}</p>
                        <p class="price">{{ goods.price }}</p>
                    </div>
                </a>
            {% endfor %}
        </div>
        <ul class="pagination">
            {{ page_string }}
        </ul>
    </div>
    <style>
    .btn1{
        width: 80px;
        height: 32px;
        background-color: #91cbe8;
        margin: 0 0 10px 5px;
        border-radius: 10px;
        border: none
    }
    .btn1:hover{
        background-color: white;
        border: solid 1px #91cbe8;
    }
    </style>
{% endblock %}